<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人档案</title>
    <link rel="stylesheet" href="styles.css">
    <link rel="stylesheet" href="records.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
</head>
<body>
    <div class="container">
        <!-- 顶部导航 -->
        <div class="top-nav">
            <h1>个人档案</h1>
        </div>

        <!-- 个人信息卡片 -->
        <div class="profile-card">
            <div class="profile-header">
                <div class="profile-avatar">
                    <i class="fas fa-user-circle"></i>
                </div>
                <div class="profile-info">
                    <h2>张三</h2>
                    <p>档案号：20240001</p>
                </div>
            </div>
        </div>

        <!-- 健康档案列表 -->
        <div class="records-list">
            <div class="record-item">
                <i class="fas fa-file-medical"></i>
                <span>基本信息</span>
                <i class="fas fa-chevron-right"></i>
            </div>
            <div class="record-item" onclick="window.location.href='checkup_records/records.html'">
                <i class="fas fa-heartbeat"></i>
                <span>健康体检记录</span>
                <i class="fas fa-chevron-right"></i>
            </div>
            <div class="record-item">
                <i class="fas fa-pills"></i>
                <span>用药记录</span>
                <i class="fas fa-chevron-right"></i>
            </div>
            <div class="record-item">
                <i class="fas fa-notes-medical"></i>
                <span>就诊记录</span>
                <i class="fas fa-chevron-right"></i>
            </div>
            <div class="record-item" onclick="window.location.href='vaccine/vaccine.html'">
                <i class="fas fa-syringe"></i>
                <span>疫苗接种记录</span>
                <i class="fas fa-chevron-right"></i>
            </div>
        </div>

        <!-- 底部导航 -->
        <nav class="bottom-nav">
            <div class="nav-item" onclick="window.location.href='/demo/index/index.html'">
                <i class="fas fa-hospital"></i>
                <span>医疗</span>
            </div>
            <div class="nav-item" onclick="window.location.href='/demo/knowledge/knowledge.html'">
                <i class="fas fa-book-medical"></i>
                <span>知识</span>
            </div>
            <div class="nav-item active" onclick="window.location.href='/demo/records/records.html'">
                <i class="fas fa-heart"></i>
                <span>档案</span>
            </div>
            <div class="nav-item" onclick="window.location.href='/demo/personal_profile/personal_profile.html'">
                <i class="fas fa-user"></i>
                <span>我的</span>
            </div>
        </nav>
    </div>
    <script src="records.js"></script>
</body>
</html> 